<template>
	<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback">
		<slot name="body"></slot>
		<view class="page-intro">
			<jyf-parser :html="tpl.intro" ref="article" :lazy-load="true" :selectable="true" @imgtap="previewImage"></jyf-parser>
		</view>
		<view class="page-btn-box">
			<view class="page-btn" @click="toLink">{{wechat ? '领取口令' : '进入会场'}}</view>
		</view>
		<view class="page-tip" v-if="wechat">
			<text class="tip-title">{{code.tip}}</text>
			<text class="tip-setup">{{code.setup}}</text>
		</view>
	</mescroll-body>
</template>

<script>
	import jyfParser from "@/components/jyf-parser/jyf-parser";
	import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
	export default {
		mixins: [MescrollMixin],
		components: {
			jyfParser
		},
		data () {
			return {
				wechat: false,
				link: "",
				code: {}
			}
		},
		props: {
			tpl: {
				type: Object,
				default () {
					return {}
				}
			},
			topHeight: {
				type: Number,
				default: 0
			},

		},
		created() {
			// #ifdef H5
			this.wechat = this.$config.isTencent();
			// #endif
			// #ifdef MP-WEIXIN || MP-QQ
			this.wechat = true;
			// #endif
		},
		methods: {
			toLink() {
				if (this.wechat) {
					if (!this.code.koulin) {
						this.$config.toast('获取口令失败,请刷新重试');
						return;
					}
					uni.setClipboardData({
						data: this.code.koulin,
						success: (res) => {
							this.$config.toast('领取成功', 2000, 'success');
						},
						fail: () => {
							this.$config.toast('领取失败');
						}
					});
					return;
				}
				if (!this.link) {
					this.$config.toast('获取链接失败,请刷新重试');
					return;
				}
				location.href = decodeURIComponent(this.link);
			},
			upCallback(page) {
				let data = {
					tpl: this.tpl.id,
					page: 1,
					min_id: 1
				}
				this.$http.get('api/default/list', {params:data}).then(res => {
					this.link = res.url;
					this.code = res.tao_code;
					this.mescroll.endSuccess(1, false);
				}).catch((error) => {
					this.$config.toast(error.message)
					this.mescroll.endErr();
				});
			},
			previewImage(e){
				uni.previewImage({
					current: 0,
					urls: e.src
				});
			}
		}
	}
</script>

<style>
	.page-intro{
		margin: 0 10rpx;
	}
	
	.page-btn-box {
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		margin: 30rpx 0;
	}
	
	.page-btn {
		height: 64rpx;
		line-height: 64rpx;
		padding: 0 20rpx;
		font-size: 28rpx;
		color: #FFFFFF;
		background-image: linear-gradient(45deg, #9000ff, #5e00ff);
		color: #ffffff;
		border-radius: 10rpx;
		text-align: center;
	}
	
	.page-tip {
		margin: 0 50rpx;
		display: flex;
		flex-direction: column;
	}
	
	.tip-title {
		font-size: 34rpx;
		font-weight: bold;
	}
	
	.tip-setup {
		margin-top: 20rpx;
		font-size: 26rpx;
	}
</style>
